var cal = new Calendar();

function Calendar() {

	var date = new Date();
	var Year = date.getFullYear();
	var whichMonth = date.getMonth();
	var totalDays;
	var current;
	var calendarTableString;
	var month = new Array(12);
	month[0] = "January";
	month[1] = "February";
	month[2] = "March";
	month[3] = "April";
	month[4] = "May";
	month[5] = "June";
	month[6] = "July";
	month[7] = "August";
	month[8] = "September";
	month[9] = "October";
	month[10] = "November";
	month[11] = "December";

	function daysInMonth(month, year) {
		return new Date(year, month, 0).getDate();
	}

	function setVar() {
		if(date.getMonth() == 0) {
			current = new Date(Year - 1, 11, 1);
		} else {
			current = new Date(Year, whichMonth, 1);
		}
		totalDays = daysInMonth(whichMonth + 1, Year);

	}

	function createBaseTable() {
		setVar();
		//weekDays[current.getDay()] this get the first day of the moth
		calendarTableString ="<div id='calendarTitle'>"+ month[whichMonth % 12] + " " + Year + "</div><br><table id='calendarTable'><tr class='topCalendarTable'><td class='topCalendarTable'>Sunday</td><td class='topCalendarTable'>Monday</td><td class='topCalendarTable'>Tuesday</td><td class='topCalendarTable'>Wednesday</td><td class='topCalendarTable'>Thursday</td><td class='topCalendarTable'>Friday</td><td class='topCalendarTable'>Saturday</td></tr>";

		for( k = 0; k < 6; k++) {
			calendarTableString += "<tr>"
			for( i = 0; i < 7; i++) {
				calendarTableString += "<td class='dayTd' id='calendarCell" + (i + k * 7 ) + "'></td>";
			}
			calendarTableString += "</tr>";
		}
		calendarTableString += "</table>";

		return calendarTableString;

	}

	function appendArrow() {
		//create left arrow
		var leftArrow = new Image();
		leftArrow.src = "Images/small_arrow_left.png";
		leftArrow.setAttribute("id", "calendarLeftArrow");
		leftArrow.setAttribute("onclick", "cal.setPreviousMonth()");
		leftArrow.style.zIndex = "1";
		document.getElementById("mainBody").appendChild(leftArrow);
		leftArrow.style.position = "fixed";
		leftArrow.style.top = "260px";
		leftArrow.style.left = "100px";
		//create right arrow
		var rightArrow = new Image();
		rightArrow.src = "Images/small_arrow_right.png";
		rightArrow.setAttribute("id", "calendarRightArrow");
		rightArrow.setAttribute("onclick", "cal.setNextMonth()");
		rightArrow.style.zIndex = "1";
		document.getElementById("mainBody").appendChild(rightArrow);
		rightArrow.style.position = "fixed";
		rightArrow.style.top = "260px";
		rightArrow.style.left = window.innerWidth - 150 + "px";
	}

	function fillCalendarTable() {
		for(var i = cal.current(); i < cal.totalDays() + cal.current(); i++) {
			document.getElementById("calendarCell" + i).innerHTML = (i - cal.current() + 1) + "<br><img class='calendarImg' src='" + images[i - cal.current()].img_src + "' id=image'" + (i - cal.current()) + "'>";
			document.getElementById("calendarCell" + i).style.visibility = "visible";
		}
	}

	function previousMonth() {
		whichMonth = (whichMonth - 1) % 12;
		if(whichMonth == -1) {
			Year--;
			whichMonth = 11;
		}
		document.getElementById("g_container").innerHTML = createBaseTable();
		fillCalendarTable();
	}

	function nextMonth() {
		whichMonth = (whichMonth + 1) % 12;
		if(whichMonth == 0) {
			Year++;
		}
		document.getElementById("g_container").innerHTML = createBaseTable();
		fillCalendarTable();
	}

	function getCurrent() {
		return current.getDay();
	}

	function getTotalNumberDays() {
		return totalDays;
	}

	return {
		createCalendar : createBaseTable,
		current : getCurrent,
		totalDays : getTotalNumberDays,
		fillCalendar : fillCalendarTable,
		putArrow : appendArrow,
		setPreviousMonth : previousMonth,
		setNextMonth : nextMonth
	}

}

function createCalendar() {
	document.getElementById("g_container").innerHTML = cal.createCalendar();
	cal.fillCalendar();
	cal.putArrow();
}